// 系统级别存储，例如：页面头部tag，是否折叠，主题样式
import { defineStore } from 'pinia'
export const useThemeStore = defineStore(
  'theme',
  () => {
    const primary = ref('#1E89FF')
    const topBgk = ref('#1F76CB')
    const topColor = ref('#fff')
    const menuBgk = ref('#fff')
    const menuColor = ref('#000')
    const menuActiveColor = ref('#1F76CB')
    const bodyBgk = ref('#f8f8f8')
    const menuActiveBgk = ref('#fff')
    const isMenuTag = ref(true)

    // 设置主题
    const togglePrimary = (primaryColor = primary.value) => {
      document.documentElement.style.setProperty(
        '--el-color-primary',
        primaryColor
      )
    }

    const resetTheme = () => {
      primary.value = '#1E89FF'
      topBgk.value = '#1F76CB'
      topColor.value = '#fff'
      menuBgk.value = '#fff'
      menuColor.value = '#000'
      menuActiveColor.value = '#1F76CB'
      menuActiveBgk.value = '#fff'
      isMenuTag.value = true
    }

    return {
      primary,
      topBgk,
      topColor,
      menuBgk,
      menuColor,
      menuActiveColor,
      menuActiveBgk,
      isMenuTag,
      bodyBgk,
      resetTheme,
      togglePrimary,
    }
  },
  {
    persist: {
      enabled: true, //Store中数据持久化生效
    },
  }
)
